import React, { useEffect } from "react";

// Home组件
const Home = () => {
  useLoginLife("Home");
  return <h2>Home组件</h2>;
};

// Profile组件
const Profile = () => {
  useLoginLife("Profile");
  return <h2>Profile组件</h2>;
};

// CustomHookDemo01组件
export default function CustomHookDemo01() {
  useLoginLife("CustomHookDemo01");
  return (
    <div>
      <h2>CustomHookDemo01</h2>
      <Home />
      <Profile />
    </div>
  );
}

//   自定义hook的作用主要是抽取相同的业务逻辑
// 函数名 开始使用use 在这个函数里面就可以使用hook了 普通的函数不可以使用hook
function useLoginLife(name) {
  useEffect(() => {
    console.log(`${name}组件被创建了`);
    return () => {
      console.log(`${name}组件被销毁了`);
    };
  }, []);
}
